<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p>JS的组成部分：DOM、BOM、ECMAscript</p>
    <p>DOM：文档对象模型</p>
    <p>BOM：浏览器对象模型</p>
    <p>ECMAscript：JS的核心，包含流程控制语句等其他逻辑代码</p>
    <input type="text" id="input" placeholder="请输入充值金额">
    <button onclick="charge()">不充值，你会变强吗？</button>
    <hr>
    <button onclick="add()">向数组尾部添加内容</button>
    <button onclick="del()">从数组尾部删除内容</button>
    <button onclick="shift()">从数组头部删除内容</button>
    <button onclick="unshift()">向数组头部添加内容</button>
    <hr>
    <script>
        function charge(){
            //let money = document.getElementById('input').value;
            let money=input.value;
            if(money>=100){
                alert('充值成功！充值金额：￥'+money+'元')
            }else{
                alert("100起充！")
            }
        }    
        let str1 = 'Jack Ma';
        console.log(str1);
        let num1 = 18;
        console.log(num1);
        let hasWude = true;
        console.log(hasWude);
        let arr1 = [1,2,3,4,'wu',true];
        console.log(arr1);
        let person = {
            name:'Pony Ma',
            age:40,
            isRich:true
        }
        let name='age';
        console.log(111,person.name); //.后面接的是数值
        console.log(222,person[name]);//[]里面加变量    
        //点击按钮，给数组添加内容
        function add(){
            arr1.push('我是最后一项');
            console.log(arr1);
        }
        //点击按钮，删除数据
        function del(){
            arr1.pop();
            console.log(arr1);
        }
        function shift(){
            arr1.shift();
            console.log(arr1);
        }
        function unshift(){
            arr1.unshift('1');
            console.log(arr1);
        }
    </script>
</body>
</html>